<template>
	<view>
    <uv-toast ref="uToast"></uv-toast>
    <uv-no-network></uv-no-network>
    <Nav title="修改密码"></Nav>
    <Header></Header>
    <view class="layout">
      <view class="form">
        <uv-form ref="form" label-width="80px">
          <uv-form-item label="新的密码" prop="pwd1">
            <uv-input v-model="form.pwd1" placeholder="请输入新的密码" password></uv-input>
          </uv-form-item>
          <uv-form-item label="确认密码" prop="pwd2">
            <uv-input v-model="form.pwd2" placeholder="请再次输入密码" password></uv-input>
          </uv-form-item>
        </uv-form>
        <view class="btn">
          <uv-button type="primary" @click="submit" text="提交"></uv-button>
        </view>
      </view>
    </view>
	</view>
</template>

<script setup>
import {ref} from "vue"
import Nav from "@/components/nav.vue";
import Header from "@/components/header.vue";
import {changePassword} from "@/request/api"
const form = ref({
  pwd1: "",
  pwd2: ""
})
const submit = () => {
  if(form.value.pwd1 !== form.value.pwd2){
    uni.showToast({
      icon: 'none',
      title: '两次密码不一样',
    });
  }
  else {
    changePassword({
      password: form.value.pwd1
    }).then(res => {
      if(res.code === 0){
        uni.showToast({
          icon: 'none',
          title: '修改成功',
        });
      }
      else {
        uni.showToast({
          icon: 'none',
          title: res.msg,
        });
      }
    })
  }
}
</script>

<style lang="scss" scoped>
.layout{
  height: calc(100vh - 88px);
  width: 100%;
  box-sizing: border-box;
  overflow-y: scroll;
  //border: 1px solid red;
  background-color: #f7f7f8;
  &::-webkit-scrollbar {
    display: none;
  }
  .form{
    width: 100%;
    padding: 15px;
    box-sizing: border-box;
  }
  .btn{
    margin-top: 20px;
    padding: 15px;
    box-sizing: border-box;
  }
}
</style>
